<template>
    <div>
        <div class="bBox" v-show="shows ===1">
            <div class="connetS" @click="onServe">
                <br> 联 <br> 系 <br>客 <br>服
            </div>

             <div class="carP" @click="shows=2">
                <br> 寻 <br>车 <br>定 <br>位
            </div>

            <div class="out">
                <br> 退 <br>出 <br>登 <br>录
            </div>

        </div>
        <div class="mapSearch" v-show="shows ===2">
            <img src="../assets/imgs/MM1.png" alt="" @click="shows=1">
        </div>
       
    </div>
</template>

<script>
export default {
    data() {
        return {
            shows : 1
        }
    },
    methods: {
        onServe(){
            this.$router.push('/customerservice')
        }
    },
}
</script>

<style lang="scss" scoped>

.bBox{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    color: azure;
    font-size: 100px;
    text-align: center;
    background:url(../assets/imgs/car1.jpeg);
    background-size:100% ;
    
    .connetS{
        width: 400px;
        height: 800px;
        background: rgba(142, 223, 232, 0.3);
        border-radius: 100px ;

        

    }
    .carP{
        width: 400px;
        height: 800px;
        background: rgba(11, 237, 105,0.3);
        border-radius: 100px ;
    }
    .out{
        width: 400px;
        height: 800px;
        background: rgba(250, 109, 66, 0.2);
        border-radius: 100px ;
    }

}
.mapSearch{
    margin-left: 200PX;
}


</style>